<template>
  <TableLayout>
    <a-tabs default-active-key="1">
      <a-tab-pane key="1" tab="在线用户">
        <OnlineUser />
      </a-tab-pane>
      <a-tab-pane key="2" tab="登录日志">
        <a-tabs default-active-key="1" v-if="isShowDetail">
          <a-tab-pane key="1" tab="统计信息">
            <LoginLog />
          </a-tab-pane>
          <a-tab-pane key="2" tab="明细信息">
            <LoginLogDetail />
          </a-tab-pane>
        </a-tabs>
        <LoginLog v-else />
      </a-tab-pane>
      <a-tab-pane key="3" tab="Execl上传进度" force-render>
        <UploadProcess />
      </a-tab-pane>
    </a-tabs>
  </TableLayout>
</template>

<script lang="ts">
import { Mixins, Component, Watch, Vue } from 'vue-property-decorator'
import { TableLayout } from '@/layouts'
import OnlineUser from './OnlineUser.vue'
import UploadProcess from './UploadProcess.vue'
import LoginLog from './LoginLog.vue'
import LoginLogDetail from './LoginLogDetail.vue'
@Component({
  components: {
    OnlineUser,
    UploadProcess,
    LoginLog,
    LoginLogDetail,
    TableLayout
  }
})
export default class AdminList extends Vue {
  get isShowDetail() {
    // @ts-ignore
    console.log(311, this.$route?.meta.permission)
    // @ts-ignore
    return this.$route?.meta.permission.find(item => item.value === 'monitor.login-log.detail')
  }
}
</script>

<style scoped>

</style>
